<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">
<head>
<title>好农易商城</title>
<link href="css/style.css" rel="stylesheet" />
<script type="text/javascript" src="js/script.js"></script>
<link href="shop/css/style.css" rel="stylesheet" type="text/css"
	media="all" />
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
	function addNum() {
		document.getElementById("count").value = parseInt(document
				.getElementById("count").value) + 1;
	}
	function subNum() {

		if (document.getElementById("count").value == "1") {
			return;
		}

		document.getElementById("count").value = parseInt(document
				.getElementById("count").value) - 1;
	}
</script>
<link rel="shortcut icon" href="shop/images/pic28.jpg" />
<link rel="Bookmark" href="shop/images/pic28.jpg" />
</head>
<body>
	<div class="header-bg">
		<div class="wrap">
			<div class="h-bg">
				<div class="total">
					<div class="header">
						<div class="box_header_user_menu">
							<div th:replace="shop/userBar :: page-user-bar"></div>
						</div>
						<div class="clear"></div>
						<div class="header-bot">
							<div th:replace="shop/logo :: page-logo"></div>
							<div class="clear"></div>
						</div>
					</div>
					<div class="menu">
						<div th:replace="shop/topBar :: page-top-bar"></div>
					</div>
					<div class="banner-top">
						<div class="header-bottom">
							<div class="header_bottom_right_images">
								<div class="about_wrapper">
									<h1>
										商品详细信息<br /> <span
											th:if="${#fields.hasErrors('${goodsForm.*}')}"><span
											th:errors="${goodsForm.*}"></span></span> <span th:text="${message}"></span>
									</h1>
								</div>
								<form action="addCart" th:object="${goodsForm}" method="post">
									<input type="hidden" name="commodityId" value="" th:value="${goodsForm.commodityId}" />
									<div class="about-top">
										<table>
											<tr>
												<td>
													<div class="grid images_3_of_1">
														<div id="tFocus">
															<div class="prev" id="prev"></div>
															<div class="next" id="next"></div>
															<ul id="tFocus-pic">
																<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId})}" width="338" height="243" alt="商品详细情况" /></li>
																<li><a href="#"><img th:src="@{showImage(pictureId=${goodsForm.pictureId1})}" width="338" height="243" alt="商品详细情况  " /></a></li>
																<li><a href="#"><img th:src="@{showImage(pictureId=${goodsForm.pictureId2})}" width="338" height="243" alt="商品详细情况" /></a></li>
																<li><a href="#"><img th:src="@{showImage(pictureId=${goodsForm.pictureId3})}" width="338" height="243" alt="商品详细情况 " /></a></li>
																<li><a href="#"><img th:src="@{showImage(pictureId=${goodsForm.pictureId4})}" width="338" height="243" alt="商品详细情况" /></a></li>
																<li><a href="#"><img th:src="@{showImage(pictureId=${goodsForm.pictureId5})}" width="338" height="243" alt="商品详细情况" /></a></li>
															</ul>
															<div id="tFocusBtn">
																<a href="javascript:void(0);" id="tFocus-leftbtn">上一张</a>
																<div id="tFocus-btn">
																	<ul>
																		<li class="active"><img th:src="@{showImage(pictureId=${goodsForm.pictureId})}" width="87" height="57" alt="商品详细情况" /></li>
																		<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId1})}" width="87" height="57" alt="商品详细情况  " /></li>
																		<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId2})}" width="87" height="57" alt="商品详细情况" /></li>
																		<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId3})}" width="87" height="57" alt="商品详细情况 " /></li>
																		<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId4})}" width="87" height="57" alt="商品详细情况" /></li>
																		<li><img th:src="@{showImage(pictureId=${goodsForm.pictureId5})}" width="87" height="57" alt="商品详细情况" /></li>
																	</ul>
																</div>
																<a href="javascript:void(0);" id="tFocus-rightbtn">下一张</a>
															</div>
														</div>
														<!--tFocus end-->

														<script type="text/javascript">
															addLoadEvent(Focus());
														</script>
													</div>
												</td>

												<td>
													<div class="grid span_2_of_3">
														<h3 th:text="${goodsForm.commodityName}"></h3>
														<p>
															品牌：<span th:text="${goodsForm.brandName}"></span>
														</p>
														<p>
															经销商：<span th:text="${goodsForm.supplierName}"></span>
														</p>
														<p>
															规格：每<span
																th:text="${#strings.concat(goodsForm.unit).concat(goodsForm.specifications)}"></span>
														</p>
														<p>
															零售价：<span th:text="${goodsForm.retailPrice}"></span>元
														</p>
														<p>
															库存：<span th:text="${goodsForm.stock}"></span>
														</p>

														<p>
															<input type="button" onclick="subNum();" value="-" /> <input
																style="width: 60px;" name="count" id="count" type="text"
																value="1" /> <input type="button" onclick="addNum();"
																value="+" />
														</p>
														<div>
															&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
															&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
															&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
															&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
															&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
														</div>
													</div>
													<div class="clear"></div>

												</td>
												<td>
													<button class="button">
														<span>加入购物车</span>
													</button>
												</td>
											</tr>
										</table>
									</div>
									<div class="clear"></div>
									<div>
										<img alt="商品详细情况" th:src="@{showImage(pictureId=${goodsForm.pictureId5})}" style="height: 500px; width: 767px;" />
									</div>
									<div>
										<img alt="商品详细情况" th:src="@{showImage(pictureId=${goodsForm.pictureId6})}" style="height: 500px; width: 767px;" />
									</div>
									<div class="clear"></div>
								</form>
							</div>
							<div class="header-para">
								<div th:replace="shop/rightBar :: page-right-bar"></div>
							</div>
							<div class="clear"></div>
							<div class="footer-bottom">
								<div class="copy">
									<div th:replace="shop/copyRight :: page-copy-right"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>



